<template>
  <div class="mod-config">
    <el-divider content-position="left">查询条件</el-divider>
    <el-form label-width="80px">
      <el-form-item label="商品类别">
        <el-select v-model="dataForm.ctgId">
          <el-option v-for="item in ctgOptions" :value="item.id" :label="item.name" :key="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="出库类型">
        <el-radio v-model="dataForm.logType" :label="1">销售出库</el-radio>
      </el-form-item>
      <el-form-item label="销售出库日期">
        <el-col :span="11">
          <el-date-picker type="date" placeholder="选择日期" v-model="dataForm.createTimeStart" value-format="yyyy-MM-dd" style="width: 100%;"></el-date-picker>
        </el-col>
        <el-col class="line" :span="2" style="text-align: center;">至</el-col>
        <el-col :span="11">
          <el-date-picker type="date" placeholder="选择日期" v-model="dataForm.createTimeEnd" value-format="yyyy-MM-dd" style="width: 100%;"></el-date-picker>
        </el-col>
      </el-form-item>
      <el-form-item label="出库仓位">
        <el-select v-model="dataForm.stockId">
          <el-option v-for="item in stockOptions" :value="item.id" :label="item.name" :key="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-row style="margin-top: 10px;">
        <el-form-item label-width="5px">
          <el-link  :href="printUrl" target="_blank" type="primary"><el-button size="mini" type="primary" @click="getWorkParams">查 询</el-button></el-link>
        </el-form-item>
      </el-row>
    </el-form>
  </div>
</template>

<script>
  let params = ''
  import { filterParams } from '@/util/tools'
  import { getDateFormat } from '@/util/tools'
  import { mapGetters } from 'Vuex'
  import {getStockList,getStockInfo} from '@/api/eims/stock'
  import {getCtgList} from '@/api/eims/ctg'

  export default {
      data () {
        return {
          printUrl: '',
          dataForm: {
              ctgId: '',
              logType: 1,
              createTimeStart: '',
              createTimeEnd: '',
              stockId: ''
          },
          ctgOptions: [],
          stockOptions: []
        };
      },
      computed: {
        ...mapGetters(['userInfo','bizData'])
      },
      created() {
        this.dataForm.createTimeStart = getDateFormat(new Date())
        this.dataForm.createTimeEnd = getDateFormat(new Date())
        this.findCtgList();
        this.getstockList();
        //this.getStockName();
      },
      methods:{
          getStockName(){
              let deptId = this.userInfo.lessDeptId
              getStockInfo(deptId).then(response=>{
                if(response.data.code == '0'){
                  this.dataForm.stockId = response.data.data[0].name
                }else{
                  this.$message.error(response.data.msg)
                }
              })
          },
        getWorkParams() {
          params = '/outbound/outboundStatistical-ctg.cpt'
          let data = filterParams(this.dataForm)
          let parameter = ''
          for(let key in data){
            parameter += '&' + key + '=' + this.dataForm[key]
          }
          this.printUrl = this.bizData.printUrl + params + parameter
        },
       findCtgList(){
          getCtgList().then(response => {
            if(response.data.code == '0'){
              this.ctgOptions = response.data.data
            }else{
              this.$message.error(response.data.msg)
            }
          })
        },
        //  获取出库仓位列表
        getstockList() {
          getStockList().then(response => {
            if(response.data.code == '0'){
              this.stockOptions = response.data.data
            }else{
              this.$message.error(response.data.msg)
            }
          })
        }
      }
    }
</script>

<style lang="scss" scoped>
  .row-bg {
    background-color: #cadee8;
    // padding-left: 15px;
    padding-right: 15px;
    padding-top: 5px;
    margin-bottom: 2px;
  }
</style>
